<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人中心</title>
    <link rel="stylesheet" href="/css/css.css">
    <link rel="stylesheet" href="/css/reset.css">
    <link rel="stylesheet" href="/css/style.css">
    <link rel="stylesheet" href="/css/index.css">
    <link rel="stylesheet" href="/css/Personal.css">
    <script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=qEwdpnptBeTmccEUlcvEjm7Wv6h4M1P4"></script>
	<script src="https://code.bdstatic.com/npm/jquery@1.12.4/dist/jquery.min.js"></script>
    <script src="/js/axios.min.js" type="text/javascript"></script>
    <script src="/js/jquery.js"></script>
    <script src="/js/vue.js"></script>
</head>
<style>
    .block{
        display: block;
    }
    .none{
        display: none;
    }
    #result {
        position: absolute;
        top: 10%;
        left: 60%;
        padding: 0px 7px;
        min-width: 350px;
        height: 70px;
        line-height: 35px;
        background: #fff;
        box-shadow: 0 2px 6px 0 rgba(27, 142, 236, 0.5);
        border-radius: 7px;
        z-index: 99;
    }
    #container {
        width: 100%;
        height: 100%;
        overflow: hidden;
        display: none;
    }
    #Econtent{
        border-top: 1px solid #A9A9A9;
        width: 400px;
        min-height: 100px;
        padding: 0;
        margin-left: 100px;
        margin-top: 40px;
    }
    .content p{
        position: absolute;
        margin-left: 100px;
        margin-top: 30px;
    }
    #addtitle input{
        width: 100px;
        height: 25px;
        margin-left: -60px;
        margin-top: 40px;
        position: absolute;
    }
</style>
<body>
    <div id="app">
        <div id="bodyone">
            <div class="header">
                <div class="wrap">
                    <ul class="header-left">
                        <li><a>小米商城</a><span>|</span></li>
                        <li><a>MIUI</a><span>|</span></li>
                        <li><a>loT</a><span>|</span></li>
                        <li><a>云服务</a><span>|</span></li>
                        <li><a>天星数科</a><span>|</span></li>
                        <li><a>有品</a><span>|</span></li>
                        <li><a>小爱开放平台</a><span>|</span></li>
                        <li><a>企业团购</a><span>|</span></li>
                        <li><a>资质证照</a><span>|</span></li>
                        <li><a>协议规则</a><span>|</span></li>
                        <li>
                            <a>下载app</a><span>|</span>
                            <div class="download">
                                <a>
                                    <img src="/img/Download.jpg" alt="">
                                    <p>小米商城app</p>
                                </a>
                            </div>
                            <div class="triangle"></div>
                        </li>
                        <li><a>智能生活</a><span>|</span></li>
                        <li><a>Select Location</a></li>
                    </ul>
                    <ul class="header-right">
                        <li id="Login-li"><a href="Login.html">登录</a><span>|</span></li>
                        <li id="Rigist-li"><a href="Login.html">注册</a><span>|</span></li>
                        <li id="account-li" >
                            <a id="account">{{account}}</a>
                            <span>|</span>
                            <div id="pesondiv">
                                <ul id="pesonul">
                                    <li onclick="mypersonalcenter()">个人中心</li>
                                    <li onclick="evaluateorder()">评价订单</li>
                                    <li onclick="mypersonalcenter()">我的喜欢</li>
                                    <li onclick="location.href=('AccountManagement.html')">小米账户</li>
                                    <li onclick="location.href=('Login.html')">退出登录</li>
                                </ul>
                            </div>
                        </li>
                        <li><a href="Login.html">我的订单</a><span>|</span></li>
                        <li><a>消息通知</a></li>
                        <li class="cart">
                            <a>购物车</a>
                            <div class="cart-list" v-if="cart != null">
                                <div>
                                    <div style="overflow: auto;height: 300px;width: 450px;">
                                        <div style="width: 300px;color: black;">
                                            <div style="margin-top: -20px;margin-left: -80px;" v-for="(item,index) in cart">
                                                <img :src="item.cartItem.productPictureList.split(',')[0]" style="height: 60px;width: 60px;  margin-top: 40px; margin-left: -100px; position: absolute;"  />
                                                <p style="margin-left: 60px;">{{item.cartItem.proName}}</p>
                                                <p style="margin-top: -20%;margin-left: 50px;">{{item.desc}}</p>
                                                <p style="margin: -28%;margin-left: 35%;">{{item.price}}元×{{item.cartItem.amount}}</p>
                                                <hr style="background-color: #A9A9A9;margin-top: 100px;width: 70%;margin-left: 25%;"/>
                                            </div>
                                        </div>
                                    </div>
                                    <div style="text-align: left;margin-left: 6%;margin-top: -8%;font-size: 13px;">
                                        <div style="color: #735b5b;">
                                            共有{{CountAll}}件商品
                                        </div>
                                        <div style="margin-top: -25%;font-size: 20px;">
                                            {{SubtotalAll}}元
                                        </div>
                                        <div style="text-align: right;margin-right: 6%;margin-top: -37%;">
                                            <input type="button"value="去购物车结算" style="width: 150px;
                                            height: 50px;background-color: rgb(232, 78, 22);color: white;border: 0px;" @click="gotoCart()">
                                        </div> 
                                    </div>
                                </div>
                            </div>
                            <div class="cart-list"  v-if="cart == null">
                                哦！购物车是空的！
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="nav">
                <div class="wrap">
                    <div class="logo">
                        <a>
                            <img src="/img/Login/Login.jpg"  onclick="Home()" style="width: 75px;" />
                        </a>
                    </div>
                    <div class="nav-bar">
                        <ul>
                            <li><a>Xiaomi手机</a>
                                <div class="nav-bar-list">
                                    <div class="wrap">
                                        <ul>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Xiaomi/1.jpg" alt="">
                                                    </div>
                                                    <p>Xiaomi Civi 1s</p>
                                                    <p>2299元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Xiaomi/2.jpg" alt="">
                                                    </div>
                                                    <p>Xiaomi 12 Pro</p>
                                                    <p>4199元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Xiaomi/3.jpg" alt="">
                                                    </div>
                                                    <p>Xiaomi12</p>
                                                    <p>3199元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Xiaomi/4.jpg" alt="">
                                                    </div>
                                                    <p>Xiaomi 12X</p>
                                                    <p>2399元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Xiaomi/5.jpg" alt="">
                                                    </div>
                                                    <p>Xiaomi 11青春活力板</p>
                                                    <p>1799元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Xiaomi/6.jpg" alt="">
                                                    </div>
                                                    <p>Xiaomi Civi</p>
                                                    <p>2299元起</p>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </li>
                            <li><a>Redmi红米</a>
                                <div class="nav-bar-list">
                                    <div class="wrap">
                                        <ul>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Redmi/1.jpg" alt="">
                                                    </div>
                                                    <p>Redmin Note 11Pro+</p>
                                                    <p>1999元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Redmi/2.jpg" alt="">
                                                    </div>
                                                    <p>Redmin Note 11Pro</p>
                                                    <p>1699元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Redmi/3.jpg" alt="">
                                                    </div>
                                                    <p>Redmin Note 11SE</p>
                                                    <p>999起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Redmi/4.jpg" alt="">
                                                    </div>
                                                    <p>Redmin 10A</p>
                                                    <p>699元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Redmi/5.jpg" alt="">
                                                    </div>
                                                    <p>Redemin K50 Pro</p>
                                                    <p>2699起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Redmi/6.jpg" alt="">
                                                    </div>
                                                    <p>Redemin K50</p>
                                                    <p>2199元起</p>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </li>
                            <li><a>电视</a>
                                <div class="nav-bar-list">
                                    <div class="wrap">
                                        <ul>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/TV/1.jpg" alt="">
                                                    </div>
                                                    <p>Redmi智能电视X55 2022</p>
                                                    <p>2399元</p>
                                                </a>
                                            </li>
                                            
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/TV/2.jpg" alt="">
                                                    </div>
                                                    <p>Redmi智能电视X65 2022</p>
                                                    <p>3099元</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/TV/3.jpg" alt="">
                                                    </div>
                                                    <p>小米电视6 65° OLED</p>
                                                    <p>6699元</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/TV/4.jpg" alt="">
                                                    </div>
                                                    <p>小米电视 大师 77° OLED</p>
                                                    <p>17999元</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/TV/5.jpg" alt="">
                                                    </div>
                                                    <p>小米透明电视</p>
                                                    <p>49999元</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/TV/6.jpg" alt="">
                                                    </div>
                                                    <p>小米电视 大师 65英寸OLED</p>
                                                    <p>8999元</p>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </li>
                            <li><a>笔记本</a>
                                <div class="nav-bar-list">
                                    <div class="wrap">
                                        <ul>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/NoteBook/1.jpg" alt="" width="160px" height="110px" />
                                                    </div>
                                                    <p>RedmiBook Pro 14 2022 锐龙版</p>
                                                    <p>5299元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/NoteBook/2.jpg" alt="" width="160px" height="110px" />
                                                    </div>
                                                    <p>RedmiBook Pro 15 2022 锐龙版</p>
                                                    <p>5499元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/NoteBook/3.jpg" alt="" width="160px" height="110px" />
                                                    </div>
                                                    <p>RedmiBook Pro 14  锐龙版</p>
                                                    <p>4699元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/NoteBook/4.jpg" alt="" width="160px" height="110px" />
                                                    </div>
                                                    <p>Redmi Book Pro 14  2022</p>
                                                    <p>5399元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/NoteBook/5.jpg" alt="" width="160px" height="110px" />
                                                    </div>
                                                    <p>小米笔记本 Pro 14 锐龙版</p>
                                                    <p>5499元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/NoteBook/6.jpg" alt="" width="160px" height="110px" />
                                                    </div>
                                                    <p>Redmi G 2021 AMD版</p>
                                                    <p>6499元起</p>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </li>
                            <li><a>平板</a>
                                <div class="nav-bar-list">
                                    <div class="wrap">
                                        <ul>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Flat/1.jpg" alt="">
                                                    </div>
                                                    <p>小米平板5</p>
                                                    <p>1999元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Flat/2.jpg" alt="">
                                                    </div>
                                                    <p>小米平板5 Pro 5G</p>
                                                    <p>3499元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Flat/3.jpg" alt="">
                                                    </div>
                                                    <p>小米平板5 Pro</p>
                                                    <p>2499元起</p>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </li>
                            <li><a>家电</a>
                                <div class="nav-bar-list">
                                    <div class="wrap">
                                        <ul>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/HouseHold/1.jpg" alt="">
                                                    </div>
                                                    <p>巨省电  米家空调 1.5匹 新1级能效 睡眠版</p>
                                                    <p>2199元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/HouseHold/2.jpg" alt="">
                                                    </div>
                                                    <p>巨省电 3匹变频新一级能效（鎏金款）</p>
                                                    <p>5299元起</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/HouseHold/3.jpg" alt="">
                                                    </div>
                                                    <p>米家扫拖机器人 1T</p>
                                                    <p>1299元起</p>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </li>
                            <li><a>路由器</a>
                                <div class="nav-bar-list">
                                    <div class="wrap">
                                        <ul>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Router/1.jpg" alt="">
                                                    </div>
                                                    <p>Redmi电竞路由AX5400</p>
                                                    <p>599元</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Router/2.jpg" alt="">
                                                    </div>
                                                    <p>小米路由AX6000</p>
                                                    <p>549元</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Router/3.jpg" alt="">
                                                    </div>
                                                    <p>小米路由AX9000</p>
                                                    <p>1299元</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Router/4.jpg" alt="">
                                                    </div>
                                                    <p>Redmi路由AC2100</p>
                                                    <p>199元</p>
                                                </a>
                                            </li>
                                            <li>
                                                <a>
                                                    <div class="nav-img-box">
                                                        <img src="/img/nav/Router/5.jpg" alt="">
                                                    </div>
                                                    <p>小米路由器4A 千兆版</p>
                                                    <p>129元</p>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </li>
                            <li><a>服务中心</a></li>
                            <li><a>社区</a></li>
                        </ul>
                    </div>
                    <div class="search">
                        <input type="text" id="select" placeholder="Redmi Note 11T Pro系列" value="Redmi Note 11T Pro系列">
                        <button type="button" @click="search()">搜索</button>
                        <div class="search-list">
                            <a>手机</a>
                            <a>电脑</a>
                            <a>笔记本 平板</a>
                            <a>小米手环7 NFC版</a>
                            <a>小爱音箱 Pro</a>
                            <a>立式空调</a>
                            <a>K歌麦克风</a>
                            <a>米家跑步机</a>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 菜单导航栏 -->
            <div class="menu">
                <ul>
                    <p>订单中心</p>
                    <br>
                    <li class="personal-li" id="li-myorder" style="color: orangered;">我的订单</li>
                    <li class="personal-li" id="li-evaluateorder">评价订单</li>
                    
                    <p>个人中心</p>
                    <br>
                    <li class="personal-li" id="li-mypersonalcenter">我的个人中心</li>
                    <li class="personal-li" id="li-Receivingaddress">收货地址</li>
                    
                    <p>账户管理</p>
                    <br>
                    <li class="personal-li" onclick="AccountManagementLogin()">个人信息</li>
                    <li class="personal-li" onclick="AccountManagementPersonal()">修改密码</li>
                </ul>
            </div>
            <!-- 我的订单 -->
            <div id="myorder">
                <h1>我的订单</h1>
                <!-- 标题 -->
                <div class="order-pi">
                    <a class="order-p" id="allorder">全部有效订单&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;|</a>
                    <a class="order-p" id="payment">待支付&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;|</a>
                    <a class="order-p" id="goods">待收货&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;|</a>
                    <a class="order-p" id="recycle">已完成订单</a>
                </div>
                <div id="orderallorder">
                    <p id="myordernull" style="display: none;">当前没有交易订单(allorder)。</p>
                    <div id="orderallorderdiv" v-for="o in OrderAllList" v-if="o.state != 4">
                        <div id="orderstatus">
                            <p id="status" v-if="o.state == 1">等待付款</p>
                            <p id="status" v-if="o.state == 2">待发货</p>
                            <p id="status" v-if="o.state == 3">待收货</p>
                            <div id="UserInformation">
                                <p id="Time">{{o.orderDate}}</p>
                                <p id="UserName">{{o.userName}}</p>
                                <p id="OrderId">订单号: {{o.orderID}}</p>
                                <p id="Ofpayment">在线支付</p>
                            </div>
                            <div id="TotalAmount">
                                <p id="Amount-text">应付金额：</p>
                                <p id="Amount">{{o.sumPrice}}.00</p>
                                <p id="Amount-text2">元</p>
                            </div>
                        </div>
                      <div class="Ofgoodsdiv" v-for="product in OrderDetailAllList"  v-if="o.orderID==product.orderID">
                        <div id="OfGoods" >
                            <div class="box" >
                                <div id="imgages">
                                    <img :src="product.productPictureList.split(',')[0]" />
                                </div>
                                <p id="GoodsName">{{product.productName}} {{product.attributeList}}</p>
                                <p id="GoodsPrice">{{product.productDetailPrice}}元 × {{product.productDetailAmount}}</p>
                            </div>
                            
                            
                           
                            <input type="button" id="detailsof" v-if="o.state == 3"  @click="Receive($event)" value="确认收货" />
                            
                            <div class="ordershouhuo">
                                    <input type="hidden" id="OfGoodsorderID" :value="o.orderID" />
                                    <input type="button" class="daishouhuo" v-if="o.state == 2" value="等待发货" />
                                    <input type="hidden" id="OfGoodsorderID" :value="o.orderID" />
                                    <input type="button" class="quxiaoandpay" v-if="o.state == 1"  @click="Purchase($event)" value="立即付款" />
                                    <input type="button" class="quxiao" v-if="o.state == 1"  @click="Delete($event)" value="取消订单" />
                            </div>

                          
                            
                        </div> 
                      </div>

                    </div>
                </div>
 

                <div id="orderpayment">
                    <p id="myordernull" style="display: none;">当前没有待支付订单(payment)。</p>
                    <div id="orderallorderdiv"  v-for="o in OrderAllList" v-if="o.state == 1">
                        <div id="orderstatus">
                            <p id="status">等待付款</p>
                            <div id="UserInformation">
                                <p id="Time">{{o.orderDate}}</p>
                                <p id="UserName">{{o.userName}}</p>
                                <p id="OrderId">订单号: {{o.orderID}}</p>
                                <p id="Ofpayment">在线支付</p>
                            </div>
                            <div id="TotalAmount">
                                <p id="Amount-text">应付金额：</p>
                                    <p id="Amount">{{o.sumPrice}}.00</p>
                                <p id="Amount-text2">元</p>
                            </div>
                        </div>
                        <div id="OfGoods">
                            <div v-for="product in OrderDetailAllList"  v-if="o.orderID==product.orderID" style="padding-bottom: 90px;">
                                <div id="imgages">
                                    <img :src="product.productPictureList.split(',')[0]" />
                                </div>
                                <p id="GoodsName">{{product.productName}} {{product.attributeList}}</p>
                                <p id="GoodsPrice">{{product.productDetailPrice}}元 × {{product.productDetailAmount}}</p>
                            </div>
                            <input type="hidden" id="OfGoodsorderID" :value="o.orderID" />
                            <input type="button" id="paymentbtn" v-if="o.state == 1" style="margin-top: -40px;" @click="Purchase($event)" value="立即付款" />
                            <input type="hidden" id="OfGoodsorderID" :value="o.orderID" />
                            <input type="button" id="detailsof" v-if="o.state == 1" style="margin-top: 0px;" @click="Delete($event)" value="取消订单" />
                           
                        </div>
                    </div>
                </div>

               
                <div id="ordergoods">
                    <p id="myordernull" style="display: none;">当前没有待收货订单(payment)。</p>
                    <div id="orderallorderdiv"  v-for="o in OrderAllList" v-if="o.state == 3">
                        <div id="orderstatus" >
                            <p id="status">待收货</p>
                            <div id="UserInformation">
                                <p id="Time">{{o.orderDate}}</p>
                                <p id="UserName">{{o.userName}}</p>
                                <p id="OrderId">订单号: {{o.orderID}}</p>
                                <p id="Ofpayment">在线支付</p>
                            </div>
                            <div id="TotalAmount">
                                <p id="Amount-text">应付金额：</p>
                                    <p id="Amount">{{o.sumPrice}}.00</p>
                                <p id="Amount-text2">元</p>
                            </div>
                        </div>
                        <div id="OfGoods">
                            <div v-for="product in OrderDetailAllList"  v-if="o.orderID==product.orderID" style="padding-bottom: 90px;">
                                <div id="imgages">
                                    <img :src="product.productPictureList.split(',')[0]" />
                                </div>
                                <p id="GoodsName">{{product.productName}} {{product.attributeList}}</p>
                                <p id="GoodsPrice">{{product.productDetailPrice}}元 × {{product.productDetailAmount}}</p>
                            </div>
                            <input type="hidden" id="OfGoodsorderID" :value="o.orderID" />
                            <input type="button" id="detailsof" v-if="o.state == 3"  @click="Receive($event)" value="确认收货" />
                        </div>
                    </div>
                </div>
                <div id="orderrecycle">
                    <p id="myordernull" style="display: none;">当前没有已完成订单(recycle)。</p>
                    <div id="orderallorderdiv" v-for="o in OrderAllList" v-if="o.state == 4">
                        <div id="orderstatus" >
                            <p id="status" v-if="o.state == 4">已完成</p>
                            <div id="UserInformation">
                                <p id="Time">{{o.orderDate}}</p>
                                <p id="UserName">{{o.userName}}</p>
                                <p id="OrderId">订单号: {{o.orderID}}</p>
                                <p id="Ofpayment">在线支付</p>
                            </div>
                            <div id="TotalAmount">
                                <p id="Amount-text">应付金额：</p>
                                    <p id="Amount">{{o.sumPrice}}.00</p>
                                <p id="Amount-text2">元</p>
                            </div>
                        </div>
                        <div id="OfGoods" >
                            <div v-for="product in OrderDetailAllList"  style="padding-bottom: 90px;">
                                <div id="imgages">
                                    <img :src="product.productPictureList.split(',')[0]" />
                                </div>
                                <p id="GoodsName">{{product.productName}} {{product.attributeList}}</p>
                                <p id="GoodsPrice">{{product.productDetailPrice}}元 × {{product.productDetailAmount}}</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 订单评价 -->
            <div id="evaluateorder">
                <h1>订单评价</h1>
                <div id="evaorder">
                    <p id="evaordernull">暂时没有符合条件的商品。</p>
                    <div id="evaorderdiv">
                        <div v-for="e in EvaluateAllList">
                            <img id="evaorderImg" :src="e.productPictureList.split(',')[0]" />
                            <p id="evaorderName">{{e.productName}}</p>
                            <p id="evaorderType">{{e.attributeList}}</p>
                            <input type="hidden" :value="e.evaluateId" />
                            <input id="evaorderButton" v-if="e.evaluateContent == null" onclick="ADDevaluate()" @click="GetEvaluateID($event)" type="button" value="去评价" />
                            <input id="evaorderButton" v-if="e.evaluateContent != null" onclick="ADDevaluate()" @click="GetEvaluateID($event)" type="button" value="查看评价" />
                        </div>
                    </div>
                </div>
            </div>
            <!-- 我的个人中心 -->
            <div id="mypersonalcenter">
                <img id="headimg" v-for="u in UserAllList" :src="u.userPicture">
                <p id="username">{{account}}</p>
                <p id="time"></p>
                <a onclick="AccountManagementLogin()" id="updateper">修改个人信息 ></a>
                <ul id="accountList" v-for="u in UserAllList" :key="u.proID">
                    <li>账户安全：<a id="level">普通</a></li>
                    <li>绑定手机：<a id="tel">{{u.userPhone}}</a></li>
                    <li>绑定邮箱：<a id="mailbox">未绑定</a></li>
                </ul>
                <hr style="margin-left: 70px;margin-top: 120px; color: #B0B0B0;" width="840px">
                <img id="mypayment" src="/img/MyPersonal/待支付.png" >
                <a id="mypaymentText">待支付的订单：</a>
                <a id="mypaymentcount">{{PaymentCount}}</a>
                <a onclick="SelectPayment()" id="mypaymenthp">查看待支付订单 ></a>
                <img id="mygoods" src="/img/MyPersonal/待收货.png" >
                <a id="mygoodsText">待收货的订单：</a>
                <a id="mygoodscount">{{GoodsCount}}</a>
                <a onclick="SelectGoods()" id="mygoodshp">查看待收货订单 ></a>
                <img id="myevaluate" src="/img/MyPersonal/待评价.png" >
                <a id="myevaluateText">待评价的订单：</a>
                <a id="myevaluatecount">0</a>
                <!-- <a id="myevaluatecount">{{EvaluateAllList.length}}</a> -->
                <a onclick="SelectRecycle()" id="myevaluatehp">查看待评价订单 ></a>
                <img id="myCart" src="/img/MyPersonal/购物车.png" >
                <a id="myCartText">购物车的订单：</a>
                <a id="myCartcount">0</a>
                <a id="myCarthp">查看购物车订单 ></a>
            </div>
            <!-- 收货地址 -->
            <div id="Receivingaddress">
                <h1>收货地址</h1>
                <div id="add-address" >
                    <img id="add-img" src="/img/mypersonal/加号.png" >
                    <a id="add-text">添加新地址</a>
                </div>
                <div id="address" v-for="a in AddressAllList">
                    <p id="name">{{a.userName}}</p>
                    <p id="phone">{{a.userPhone}}</p>
                    <p id="content">{{a.addressContent}}</p>
                    <input type="hidden" :value="a.addressId" />
                    <p id="update" onclick="AddAddress()" @click="GetAddressID($event)">修改</p>
                    <p id="delete" @click="GetAddressID($event)">删除</p>
                </div>
            </div>
        </div>
        <!-- 添加地址页面 -->
        <div id="ADDaddress">
            <!-- 标题 -->
            <div id="addtitle">
                <p id="addtitletext">添加收货地址</p>
                <a id="addesc" onclick="esc()">x</a>
            </div>
            <!-- 主体 -->
            <div id="addre-body">
                <input id="txt-name" type="text" name="name" placeholder="姓名"/>
                <input id="txt-phone" type="text" name="phone" placeholder="手机号" />
                <div id="addressDivOne"> 
                    <input id="txt-address" type="text" name="address" placeholder="选择省 / 市 / 区 / 街道" />
                    <textarea id="txt-addre" name="addre" placeholder="详细地址"></textarea>
                    <input id="txt-addree" type="text" name="addree" placeholder="地址省份"  />
                    <div id="searchResultPanel"></div>
                </div>
            </div>
            <div id="addressDivTwo" style="display: none;">
                <p id="esc">x</p>
                <div id="input-search">
                    <div>
                        <input id="txt-addressone" type="text" placeholder="输入街道、乡镇、小区或商圈名称">
                        <img src="/img/address/搜索.png" alt="" style="position: absolute;margin-left: -590px;margin-top: 55px;">
                    </div>
                    <div id='container'></div>
                    <p style="color: #B0B0B0;margin-left: -436px;margin-top: 12px;">例如：北京 华润五彩城</p>
                    <hr style="width: 94%;margin-top: 10px;color: #B0B0B0;margin-left: 20px;" />
                    <p style="margin-top: 16px; margin-left: -490px;color: #B0B0B0;">手动选择地址 ></p>
                </div>
            </div>
            <!-- 底部 -->
            <div id="addbottom">
                <input type="button" id="sumbit" value="确定" />
                <input type="button" id="cancel" onclick="esc()" value="取消" />
            </div>
        </div>
        <!-- 评价页面 -->
        <div id="ADDevaluate">
            <!-- 标题 -->
            <div id="addtitle">
                <p id="addtitletext">商品评价</p>
                <a id="addesc" onclick="esc()">x</a>
                <div v-for="e in EvaluateList">
                    <img id="ADDevaluateImg" :src="e.productPictureList.split(',')[0]" />
                    <p id="ADDevaluateName">{{e.productName}}</p>
                    <p id="ADDevaluateType">{{e.attributeList}}</p>
                </div>
                <div class="stars">
                    <p>评价等级：</p>
                    <ul>
                        <li>★</li>
                        <li>★</li>
                        <li>★</li>
                        <li>★</li>
                        <li>★</li>
                    </ul>
                </div>
                <div class="content"  v-for="e in EvaluateList">
                    <p>评价内容：</p>
                    <textarea id="Econtent" placeholder="说点什么...." >{{e.evaluateContent}}</textarea>
                </div>
                <div v-for="e in EvaluateList">
                    <input type="button" v-if="e.evaluateContent == null" value="提交" @click="EvaluateSumbit" />
                </div>
            </div>
        </div>
    </div>
    <script src="/js/userscommon.js"></script>
    <script>
        let vm = new Vue({
            el:"#app",  
            data:{
                UserAllList: [],
                OrderAllList:[],
                OrderDetailAllList:[],
                EvaluateAllList:[],
                AddressAllList:[],
                EvaluateList:[],
                AddressList:[],
                cart:[],
                account: '',
                PaymentCount:0,
                GoodsCount :0,
                RecycleCount:0,
                CountAll:0,
                SubtotalAll:0,
            },
            created: function () {
                // 获取跳转页面的url数据
                //首页传送的指定商品id从而获取对应商品信息
                var url = window.location.href
                var path = url.split('?')[1]
                var field = new URLSearchParams('?'+path)
                // var account = field.get('account')
                var account = 1688311544
                this.account= account
                this.OrderAll(account)
                this.GetUserID(account)
                this.UserAll(account)
                this.Count(account)
                this.EvaluateAll(account)
                this.AddressAll(account)
                this.showCart(account)
            },
            methods: {
                OrderAll : function(account){
                    axios.get('/order/getAllAccount',{ params: { account: account} }).then(function (resp) {
                        vm.OrderAllList = resp.data.data
                    })
                    axios.get('/orderDetail/getAllAccount',{ params: { account:account} }).then(function (resp) {
                        vm.OrderDetailAllList = resp.data.data
                    })
                },
                //读取登录用户信息
                GetUserID : function(account){
                    if(this.account == null || this.account == 0){
                        var login =  document.getElementById("Login-li")
                        var rigist = document.getElementById("Rigist-li")
                        login.className="block"
                        rigist.className="block"
                        var account = document.getElementById("account-li")
                        account.className="none"
                    }else{
                        var login =  document.getElementById("Login-li")
                        var rigist = document.getElementById("Rigist-li")
                        login.className="none"
                        rigist.className="none"
                        var account = document.getElementById("account-li")
                        account.className="block"
                    }
                },
                UserAll: function(account){
                    axios.get('/user/getAllAccount',{ params: { account : account} }).then(function (resp) {
                        vm.UserAllList = resp.data.data
                        vm.phone = resp.data.data[0].userPhone
                    })
                },
                Purchase : function(e){
                    var orderId = e.currentTarget.previousElementSibling.value
                    window.location.href="ConfirmOrder.html?account="+vm.account+"&orderID="+orderId;
                },
                Receive : function(e){
                    var orderId = e.currentTarget.previousElementSibling.value
                    axios.get('/order/update',{ params: { account: this.account , orderID : orderId,state:4} }).then(function (resp) {
                        if(true == resp.data.data){
                            alert("已确认收货")
                            window.location.href=
                                    "PersonalCenter.html?account="+vm.account;
                        }else{
                            alert("失败")
                        }
                    })
                },
                Delete : function(e){
                    var orderId = e.currentTarget.previousElementSibling.value
                    axios.get('/order/delete',{ params: { account: this.account , orderID : orderId} }).then(function (resp) {
                        if(true == resp.data.data){
                            alert("已取消订单")
                        }else{
                            alert("失败")
                        }
                    })
                },
                Count : function(account){
                    axios.get('/order/paymentCount',{ params: { account: account} }).then(function (resp) {
                        vm.PaymentCount = resp.data.data
                    })
                    axios.get('/order/goodsCount',{ params: { account: account} }).then(function (resp) {
                        vm.GoodsCount = resp.data.data
                    })
                    axios.get('/order/recycleCount',{ params: { account: account} }).then(function (resp) {
                        vm.RecycleCount = resp.data.data
                    })
                },
                EvaluateAll : function(account){
                    axios.get('/evaluate/getAllUserID',{ params: { account: account} }).then(function (resp) {
                        vm.EvaluateAllList = resp.data.data
                    })
                },
                EvaluateSumbit: function(){
                    var content = document.getElementById("Econtent").value
                    axios.get('/order/evaluateUpdate',{ params: { content: content} }).then(function (resp) {
                        if(true == resp.data.data){
                            vm.EvaluateAll();
                        }
                    })
                },
                GetEvaluateID : function(e){
                    var evaluateId = e.currentTarget.previousElementSibling.value
                    axios.get('/evaluate/getEvaluateID',{ params: { evaluateId:evaluateId} }).then(function (resp) {
                        vm.EvaluateList = resp.data.data
                    })
                },
                search:function(){
                    var name = document.getElementById("select").value;
                    location.href ="WaresSearch.html?name="+name+"&account="+vm.account;
                },
                AddressAll : function(account){
                    axios.get('/address/getAllUserID',{ params: { account: account} }).then(function (resp) {
                        vm.AddressAllList = resp.data.data
                    })
                },
                GetAddressID:function(e){
                    var addressId = e.currentTarget.previousElementSibling.value
                    console.log(addressId)
                    axios.get('/address/getAllAddressID',{ params: { addressId:addressId} }).then(function (resp) {
                        vm.AddressList = resp.data.data
                    })
                },
                showCart:function(uid){
                    axios.get('/cart/show',{ params: { userID : uid} }).then(function (resp) {
                        vm.cart=resp.data.data
                        for (var index = 0; index < vm.cart.length; index++) {
                            vm.sumTotal+=vm.cart[index].subtotal;
                            vm.count+=vm.cart[index].cartItem.amount;
                            vm.productDetailID.push(vm.cart[index].cartItem.detailID);
                        }
                    });
                    axios.get('/cart/getCountAndSubtotal',{ params: { account : uid} }).then(function (resp) {
                        vm.CountAll=resp.data.data[0].countAll
                        vm.SubtotalAll=resp.data.data[0].subtotalAll
                    })
                },
                gotoCart:function(){}
            },
        });
    </script>
    <script src="/js/search.js"></script>
    <script src="/js/Personal.js"></script>		
    <script src="/js/account.js"></script>
    <script src="/js/star.js"></script>
</body>
</html>